new Vue({
    el: "#mainContent",
    data: {
        name: "",
        cardId: "",
        card: {},
        remarkList: [],
        remarkContent: "",
        getCardDetail: "/card/get_card_detail.ajax",
        publishRemarkUrl: "/card/publish_remark.ajax",
        cardIndexUrl: "/card/index"
    },
    mounted: function () {
        this.name = $("#nameUser").val();
        this.cardId = $("#cardId").val();
        this.initPage();
    },
    methods: {
        //初始化页面
        initPage: function () {
            console.log(this.cardId);
            this.$http.post(this.getCardDetail, {cardId: this.cardId}, {emulateJSON: true})
                .then((response) => {
                    this.$set(this, "card", response.data.data.cardVO);
                    this.$set(this, "remarkList", response.data.data.remarkVOList);
                })
                .catch(function (response) {
                    console.log(response)
                });
        },
        pubRemark: function () {
            console.log(this.remarkContent);
            if (this.remarkContent == "") {
                alert("评论不可为空!");
                return;
            }
            this.$http.post(this.publishRemarkUrl, {
                cardId: this.cardId,
                userId: 1,//TODO
                remarkContent: this.remarkContent
            }, {emulateJSON: true})
                .then((response) => {
                    this.remarkList.push(response.data.data);
                    this.card.cardRemarkCount = this.card.cardRemarkCount + 1;
                    this.remarkContent = "";
                })
                .catch(function (response) {
                    console.log(response)
                });
        },
        login: function () {
            layer.open({
                type: 2,
                title: '',
                fix: false,
                maxmin: true,
                shadeClose: true,
                area: ['400px', '300px'],
                content: '/login/login',
            });
        },
        register: function () {
            layer.open({
                type: 2,
                title: '',
                fix: false,
                area: ['400px', '300px'],
                content: '/login/login',
            });
        },
        jumpToCard: function () {
            window.location.href = this.cardIndexUrl;
        }
    }
});